<%--
  Created by IntelliJ IDEA.
  User: 刘琛
  Date: 2020/7/18
  Time: 18:04
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%pageContext.setAttribute("APP_PATH", request.getContextPath());%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta charset="utf-8" />
    <title>设备维修统计</title>

    <script type="text/javascript" src="${APP_PATH }/recourse/js/echarts.min.js"></script>
    <meta name="description" content="Static &amp; Dynamic Tables" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

    <!-- bootstrap & fontawesome -->
    <link rel="stylesheet" href="${APP_PATH }/assets/css/bootstrap.min.css" />
    <link rel="stylesheet" href="${APP_PATH }/assets/font-awesome/4.5.0/css/font-awesome.min.css" />
    <link rel="stylesheet" href="${APP_PATH}/assets/fonts/iconfont.css"/>
    <!-- page specific plugin styles -->
    <!-- text fonts -->
    <link rel="stylesheet" href="${APP_PATH }/assets/css/fonts.googleapis.com.css" />

    <!-- ace styles -->
    <link rel="stylesheet" href="${APP_PATH }/assets/css/ace.min.css" class="ace-main-stylesheet" id="main-ace-style" />

    <!--[if lte IE 9]-->
    <%--    <link rel="stylesheet" href="${APP_PATH }/assets/css/ace-part2.min.css" class="ace-main-stylesheet" />--%>
    <!--[endif]-->
    <link rel="stylesheet" href="${APP_PATH }/assets/css/ace-skins.min.css" />
    <link rel="stylesheet" href="${APP_PATH }/assets/css/ace-rtl.min.css" />


    <script src="${APP_PATH }/recourse/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="${APP_PATH }/assets/js/xadmin.js"></script>
    <script src="${APP_PATH }/assets/js/ace-extra.min.js"></script>

    <!-- HTML5shiv and Respond.js for IE8 to support HTML5 elements and media queries -->

    <!--[if lte IE 8]-->
    <%--    <script src="${APP_PATH }/assets/js/html5shiv.min.js"></script>--%>
    <%--    <script src="${APP_PATH }/assets/js/respond.min.js"></script>--%>
    <!--[endif]-->
</head>

<body class="no-skin">
<div id="navbar" class="navbar navbar-default          ace-save-state">
    <div class="navbar-container ace-save-state" id="navbar-container">
        <button type="button" class="navbar-toggle menu-toggler pull-left" id="menu-toggler" data-target="#sidebar">
            <span class="sr-only">Toggle sidebar</span>

            <span class="icon-bar"></span>

            <span class="icon-bar"></span>

            <span class="icon-bar"></span>
        </button>

        <div class="navbar-header pull-left">
            <a href="#" class="navbar-brand">
                <small>
                    <i><img src="${APP_PATH}/assets/images/ic_launcher_foreground.png" width="30"></i>
                    智慧维修
                </small>
            </a>
        </div>

        <div class="navbar-buttons navbar-header pull-right" role="navigation">
            <ul class="nav ace-nav">
                <li class="light-blue dropdown-modal">
                    <a data-toggle="dropdown" href="#" class="dropdown-toggle">
                        <img class="nav-user-photo" src="/mmmsimage/${admin.icon}" alt="无" />
                        <span class="user-info">
									<small>欢迎,</small>
									${admin.name}
								</span>

                        <i class="ace-icon fa fa-caret-down"></i>
                    </a>

                    <ul class="user-menu dropdown-menu-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">

                        <li>
                            <a href="${pageContext.request.contextPath}">
                                <i class="ace-icon fa fa-power-off"></i>
                                退出登录
                            </a>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </div><!-- /.navbar-container -->
</div>

<div class="main-container ace-save-state" id="main-container">
<script type="text/javascript">
    try{ace.settings.loadState('main-container')}catch(e){}
</script>

<div id="sidebar" class="sidebar                  responsive                    ace-save-state" style="font-size: large">
    <script type="text/javascript">
        try{ace.settings.loadState('sidebar')}catch(e){}
    </script>


    <ul class="nav nav-list">


        <li class="">
            <a href="#" class="dropdown-toggle">
                <i class="menu-icon iconfont icon-update_status red" style="font-size: large"></i>
                <span class="menu-text" style="font-size: large">维修单审核</span>

                <b class="arrow fa fa-angle-down"></b>
            </a>
            <b class="arrow"></b>

            <ul class="submenu">
                <li class="">
                    <a href="${pageContext.request.contextPath}/approver/approveOrder">
                        <i class="menu-icon fa fa-caret-right"></i>
                        维修单待审核
                    </a>
                    <b class="arrow"></b>
                </li>

                <li class="">
                    <a href="${pageContext.request.contextPath}/approver/approveBidding">
                        <i class="menu-icon fa fa-caret-right"></i>
                        报价审核
                    </a>
                    <b class="arrow"></b>
                </li>
                <li class="">
                    <a href="${pageContext.request.contextPath}/approver/approveCompletion">
                        <i class="menu-icon fa fa-caret-right"></i>
                        验收待审核
                    </a>
                    <b class="arrow"></b>
                </li>
            </ul>
        </li>

        <ul class="nav nav-list">


            <li class="">
                <a href="#" class="dropdown-toggle">
                    <i class="menu-icon iconfont icon-svgorderred green" style="font-size: large"></i>
                    <span class="menu-text" style="font-size: large">维修信息</span>

                    <b class="arrow fa fa-angle-down"></b>
                </a>
                <b class="arrow"></b>

                <ul class="submenu">
                    <li class="">
                        <a href="${pageContext.request.contextPath}/approver/orderSt">
                            <i class="menu-icon fa fa-caret-right"></i>
                            维修信息统计
                        </a>
                        <b class="arrow"></b>
                    </li>
                    <li class="">
                        <a href="${pageContext.request.contextPath}/approver/approveOrdering">
                            <i class="menu-icon fa fa-caret-right"></i>
                            在办维修
                        </a>
                        <b class="arrow"></b>
                    </li>
                    <li class="">
                        <a href="${pageContext.request.contextPath}/approver/allOrderinfo">
                            <i class="menu-icon fa fa-caret-right"></i>
                            所有维修信息
                        </a>
                        <b class="arrow"></b>
                    </li>
                </ul>
            </li>
        </ul>
        <!--人员注册审核-->
        <ul class="nav nav-list">
            <li class="">
                <a href="#" class="dropdown-toggle">
                    <i class="menu-icon glyphicon glyphicon-user blue" style="font-size: large"></i>
                    <span class="menu-text" style="font-size: large">人员信息</span>

                    <b class="arrow fa fa-angle-down"></b>
                </a>
                <b class="arrow"></b>

                <ul class="submenu">
                    <li class="">
                        <a href="${pageContext.request.contextPath}/approver/human_satis">
                            <i class="menu-icon fa fa-caret-right"></i>
                            人员信息统计
                        </a>
                        <b class="arrow"></b>
                    </li>
                    <li class="">
                        <a href="${pageContext.request.contextPath}/approver/registeradmin">
                            <i class="menu-icon fa fa-caret-right"></i>
                            内部人员注册审核
                        </a>
                        <b class="arrow"></b>
                    </li>
                    <li class="">
                        <a href="${pageContext.request.contextPath}/approver/registercompany">
                            <i class="menu-icon fa fa-caret-right"></i>
                            维修方注册审核
                        </a>
                        <b class="arrow"></b>
                    </li>
                    <li class="">
                        <a href="${pageContext.request.contextPath}/approver/persioninfo">
                            <i class="menu-icon fa fa-caret-right"></i>
                            部门所有人员信息
                        </a>
                        <b class="arrow"></b>
                    </li>

                </ul>
            </li>
        </ul>

        <!--设备管理功能-->
        <ul class="nav nav-list">

            <li class="">
                <a href="#" class="dropdown-toggle">
                    <i class="menu-icon iconfont icon-__equipment orange" style="font-size: large"></i>
                    <span class="menu-text" style="font-size: large">设备管理</span>

                    <b class="arrow fa fa-angle-down"></b>
                </a>
                <b class="arrow"></b>

                <ul class="submenu">
                    <li class="">
                        <a href="${pageContext.request.contextPath}/approver/equipmentstatis">
                            <i class="menu-icon fa fa-caret-right"></i>
                            设备信息统计
                        </a>
                        <b class="arrow"></b>
                    </li>
                    <li class="">
                        <a href="${pageContext.request.contextPath}/approver/allEquipment">
                            <i class="menu-icon fa fa-caret-right"></i>
                            所有设备信息
                        </a>
                        <b class="arrow"></b>
                    </li>
                </ul>
            </li>
        </ul>
        <!--维修单查询-->
    </ul><!-- /.nav-list -->

    <div class="sidebar-toggle sidebar-collapse" id="sidebar-collapse">
        <i id="sidebar-toggle-icon" class="ace-icon fa fa-angle-double-left ace-save-state" data-icon1="ace-icon fa fa-angle-double-left" data-icon2="ace-icon fa fa-angle-double-right"></i>
    </div>
</div>


<div class="main-content">
    <div class="main-content-inner">
        <div class="breadcrumbs ace-save-state" id="breadcrumbs">
            <ul class="breadcrumb">
                <li>
                    <i class="ace-icon fa fa-home home-icon"></i>
                    设备管理
                </li>
                <li class="active">设备统计信息</li>

            </ul><!-- /.breadcrumb -->

        </div>

            <div class="page-content">

                <div class="row">
                    <div class="col-xs-12">
                        <div class="clearfix">
                            <div class="pull-right tableTools-container"></div>
                        </div>
                        请输入年份： <select id="myYear" >
                        <option value="${year}" selected="selected">${year}</option>
                    </select>
                        <button id = "btn" name = "btn" type="button">确认选择</button><br><br>
                        <div style="width:80vw;height: 400px;margin-left: 30px;">
                            <div id="main" style="width: 35vw;height:400px;float: left;"></div>
                            <div id="main2" style="width: 35vw;height:400px;float: left;margin-left: 20px;"></div>
                        </div>
                        <div style="width:80vw;height: 400px;margin-left: 30px;margin-top: 35px;">
                            <div id="main3" style="width: 35vw;height:400px;float: left"></div>
                            <div id="main4" style="width: 35vw;height:400px;float: left;margin-left: 20px;"></div>
                        </div>

                    </div>
                </div>
                <!-- PAGE CONTENT ENDS -->
            </div><!-- /.col -->
        </div><!-- /.row -->
    </div><!-- /.page-content -->
</div>
</div>

<div class="footer">
    <div class="footer-inner">
        <div class="footer-content">
            <i><img src="${APP_PATH}/assets/images/ic_launcher_foreground.png" width="20"></i>
            <span class="bigger-120">
                湖北南星化工总厂 &copy; 2020
            </span>
        </div>
    </div>
</div>

<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
    <i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
</a>
</div>


<script src="${APP_PATH }/assets/js/jquery-2.1.4.min.js"></script>

<script type="text/javascript">
    if('ontouchstart' in document.documentElement) document.write("<script src='${APP_PATH }/assets/js/jquery.mobile.custom.min.js'>"+"<"+"/script>");
</script>
<script src="${APP_PATH }/assets/js/bootstrap.min.js"></script>
<!-- page specific plugin scripts -->
<script src="${APP_PATH }/assets/js/jquery.dataTables.min.js"></script>
<script src="${APP_PATH }/assets/js/jquery.dataTables.bootstrap.min.js"></script>
<script src="${APP_PATH }/assets/js/dataTables.buttons.min.js"></script>
<script src="${APP_PATH }/assets/js/buttons.flash.min.js"></script>
<script src="${APP_PATH }/assets/js/buttons.html5.min.js"></script>
<script src="${APP_PATH }/assets/js/buttons.print.min.js"></script>
<script src="${APP_PATH }/assets/js/buttons.colVis.min.js"></script>
<script src="${APP_PATH }/assets/js/dataTables.select.min.js"></script>
<!-- ace scripts -->
<script src="${APP_PATH }/assets/js/ace-elements.min.js"></script>
<script src="${APP_PATH }/assets/js/ace.min.js"></script>
<script language="javascript" type="text/javascript">
    window.onload=function(){
//设置年份的选择
        var myDate= new Date();
        var startYear=myDate.getFullYear()-5;//起始年份
        var endYear=myDate.getFullYear();//结束年份
        var obj=document.getElementById('myYear')
        for (var i=startYear;i<=endYear;i++)
        {
            obj.options.add(new Option(i,i));
        }
        obj.options[obj.options.length-51].selected=1;
    }
</script>
<script>
    $("#btn").click(function () {
        //获取input表单文本框的时间值
        var year = document.getElementById("myYear").value;

        window.location.href="${pageContext.request.contextPath}/approver/equipmentstatis?times="+year;

    });
</script>

<script>
    var myChart = echarts.init(document.getElementById('main2'));
    let titleList = ['装备维修','营房维修','公共维修'];
    let lineList = [${equip.get(0)},${equip.get(1)},${equip.get(2)},${equip.get(3)},${equip.get(4)},${equip.get(5)}]; // 2月
    let lineCompareList = [${house.get(0)},${house.get(1)},${house.get(2)},${house.get(3)},${house.get(4)},${house.get(5)}]; // 2月（对比）
    let lineCompareList2=[${public1.get(0)},${public1.get(1)},${public1.get(2)},${public1.get(3)},${public1.get(4)},${public1.get(5)}]
    option = {
        title: {
            text: '总维修次数(年)',
            left: 'center',
        },
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            x: 'center',
            top:'30',
            data:titleList
        },
        xAxis: {
            type: 'category',
            data:[${dt.get(0)},${dt.get(1)},${dt.get(2)},${dt.get(3)},${dt.get(4)},${dt.get(5)}]
        },
        yAxis: {
            type: 'value'
        },
        series: [
            {
                name: titleList[0],
                data: lineList,
                type: 'line',
                label: {
                    normal: {
                        show: true,
                        position: 'top'
                    }
                },
            },
            {
                name: titleList[1],
                data: lineCompareList,
                type: 'line',
                label: {
                    normal: {
                        show: true,
                        position: 'top'
                    }
                },
            },
            {
                name: titleList[2],
                data: lineCompareList2,
                type: 'line',
                label: {
                    normal: {
                        show: true,
                        position: 'top'
                    }
                },
            }
        ]
    };
    myChart.setOption(option);
    <%--</script>--%>
    <%--<script>--%>
    var myChart1 = echarts.init(document.getElementById('main'));
    let titleList1 = ['维修费用'];
    let lineList1 =  [${list.get(0).get("price")},${list.get(1).get("price")},${list.get(2).get("price")},${list.get(3).get("price")},${list.get(4).get("price")},${list.get(5).get("price")}]; // 2月
    option = {
        title: {
            text: '总维费用(年)',
            left: 'center',
        },
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            x: 'center',
            top:'30',
            data:titleList1
        },
        xAxis: {
            type: 'category',
            data:[${dt.get(0)},${dt.get(1)},${dt.get(2)},${dt.get(3)},${dt.get(4)},${dt.get(5)}]
        },
        yAxis: {
            type: 'value'
        },
        series: [
            {
                name: titleList1[0],
                data: lineList1,
                type: 'line',
                label: {
                    normal: {
                        show: true,
                        position: 'top'
                    }
                },
            }

        ]
    };
    myChart1.setOption(option);
</script>


</body>
</html>

